<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <h:outputStylesheet library="css" name="style.css"/>
    </h:head>
    <h:body>
        <div id="outer">
            <div id="wrapper">
                <div id="body-bot">
                    <div id="body-top">
                        <div id="logo">
                            <h1>TRANSPORTATION SERVICE</h1>
                            <p>We care about your cargo</p>
                        </div>
                        <div id="nav">
                            <ul>
                                <li><a href="Home.xhtml">Home</a></li>
                                <li><a href="index9.xhtml">SERVICES</a></li>
                                <li><a href="http://www.free-css.com/">CONTACT US</a></li>
                                <li><a href="http://www.free-css.com/">ABOUT US</a></li>
                            </ul>
                            <div class="clear"> </div>
                        </div>
                        <h:form id="form1">
                            <div id="greenbox1">
                                <!-- <h2 style="color: brown">Service Types</h2>-->


                                <p:tree value="#{allservicebean.root}" selectionMode="single"  var="node" dynamic="true">
                                    <p:ajax event="select" oncomplete="openMyDiv()" listener="#{allservicebean.onNodeSelect}"
                                            /><!--update=":form1:nameid,:form1:rateid,:form1:terminal1id,:form1:terminal2id,:form1:commentid,:form1:routeid"  />-->
                                    <p:treeNode>
                                        <h:outputText value="#{node.name}" />
                                    </p:treeNode>
                                </p:tree>
                            </div>
                            
                        </h:form>
                    </div>
                </div>
            </div>
        </div>
        <div id="copyright"> &copy; Copyright information goes here. All rights reserved | designed by <a href="http://www.freewebsitetemplates.com">free website templates</a></div>
        <h:outputScript library="scripts" name="jquery-1.10.2.min.js"/>
        <h:outputScript library="scripts" name="jquery-migrate-1.2.1.min.js"/>

        <script type='text/javascript'>
            var $jq = jQuery.noConflict(true);

            $(document).ready(function() {
//                alert("nohssa");
                document.getElementById("page3").style.display = "none";
                document.getElementById("page4").style.display = "none";
                document.getElementById("page5").style.display = "none";
            }
            );
            function openMyDiv() {
                document.getElementById("emptypage").style.display = "none";
                document.getElementById("page3").style.display = "block";
            }

            function openMyDiv1() {
                document.getElementById("page3").style.display = "none";
                document.getElementById("page4").style.display = "block";
            }
            function openMyDiv2() {
                console.log("func");
                var result = document.getElementById("form1:txtHide").value;
                console.log(result);
                if (result === "true")
                {
                    document.getElementById("page4").style.display = "none";
                    document.getElementById("page3").style.display = "block";
                }
            }

            function openMyDiv3() {
//                console.log("func");
//                var result = document.getElementById("form1:txtHide").value;
//                console.log(result);
//                if(result === "true")
//                {
                document.getElementById("page4").style.display = "none";
                document.getElementById("page5").style.display = "block";
//                }   
            }

        </script>
    </h:body>
</html>